<script setup>
// import { onMounted } from 'vue'
import { ref } from 'vue'

// onMounted(() => {
//   console.log(tableData.value)
// })
const tableData = ref([
  {
    o01: '1',
    o02: '20210810001',
    o03: '001',
    o04: '0001',
    o05: '作业名称',
    o06: '生产线名称',
    o07: '检验批次',
    o08: '产品名称',
    o09: new Date('2024-08-10').toLocaleDateString().replace(/\//g, '-'),
    o10: '检验项1',
    o11: '100',
    o12: '10',
    o13: '检验值',
    o14: '阀值上限',
    o15: '阀值下限',
    o16: '合格',
    o17: '检验人',
    o18: new Date('2021-08-10').toLocaleDateString().replace(/\//g, '-')
  },
  {
    o01: '2',
    o02: '20210810001',
    o03: '002',
    o04: '0002',
    o05: '作业名称',
    o06: '生产线名称',
    o07: '检验批次',
    o08: '产品名称',
    o09: new Date('2022-08-10').toLocaleDateString().replace(/\//g, '-'),
    o10: '检验项2',
    o11: '200',
    o12: '20',
    o13: '检验值',
    o14: '阀值上限',
    o15: '阀值下限',
    o16: '不合格',
    o17: '检验人',
    o18: new Date('2021-08-10').toLocaleDateString().replace(/\//g, '-')
  }
])

// 把本地数据取出来
tableData.value =
  JSON.parse(localStorage.getItem('tableDatas')) || tableData.value
// console.log(JSON.parse(localStorage.getItem('tableDatas')))
// 删除功能
const clickRemove = (item) => {
  console.log(item)
  // 调用接口 根据id删除数据  传入id

  // tableData.values = tableData.values.filter((value) => value.o01 !== item.o01)
  // 提示消息
  ElMessage.error('删除成功')
  tableData.value = tableData.value.filter((value) => value.o01 !== item.o01)

  // 重新渲染数据
  localStorage.setItem('tableDatas', JSON.stringify(tableData.value))
}

// 修改弹出的对话框
const dialogVisible = ref(false)
const ruleFormRef = ref()
const ruleForm = ref({
  o01: '',
  o04: '',
  standar: '',
  o12: '',
  o13: '',
  result: '',
  text: ''
})
const rules = {
  o04: [{ required: true, message: '请输入完工单号', trigger: 'blur' }],
  o10: [{ required: true, message: '请输入检验标准', trigger: 'blur' }],
  o12: [{ required: true, message: '请输入抽取数量', trigger: 'blur' }],
  o13: [{ required: true, message: '请输入校验值', trigger: 'blur' }],
  result: [{ required: true, message: '请输入检验结果', trigger: 'blur' }]
}
let currentID = ''
// 点击修改按钮
const changeDate = (item) => {
  // console.log(item)
  currentID = item.o01 - 1
  dialogVisible.value = true
  dialogVisibleSelect.value = false
  // 回显数据
  ruleForm.value = {
    o01: item.o01,
    o04: item.o04,
    o10: item.o10,
    o12: item.o12,
    o13: item.o13,
    result: item.o16,
    text: ''
  }
}
// 点击确认进行自定义校验
const handleRequired = () => {
  ruleFormRef.value.validate((isOk) => {
    if (isOk) {
      // 调用接口
      // 把输入的数据传给tableData
      // console.log(tableData[currentID].o04)
      tableData.value[currentID].o04 = ruleForm.value.o04
      tableData.value[currentID].o10 = ruleForm.value.o10
      tableData.value[currentID].o12 = ruleForm.value.o12
      tableData.value[currentID].o13 = ruleForm.value.o13
      tableData.value[currentID].o16 = ruleForm.value.result

      // 提示消息
      ElMessage.success('修改成功')
      // 把修改的内容重新渲染重新赋值

      // 关闭弹框
      dialogVisible.value = false
    } else {
      // 提示消息
      ElMessage.error('请输入完成信息')
    }
  })
}

// 点击取消按钮
const handleCancel = () => {
  // 重置表单
  ruleFormRef.value.resetFields()
  // 关闭弹框
  dialogVisible.value = false
}

// 点击选择按钮
const dialogVisibleSelect = ref(false)
const handleSelect = () => {
  // console.log(123)
  // console.log(item)
  dialogVisible.value = false
  dialogVisibleSelect.value = true
}

// 点击选择按钮弹出的对话框
const dialogVisibleVerify = ref(false)
const handleVerify = () => {
  dialogVisible.value = false
  dialogVisibleVerify.value = true
}

const handleSelectCancel = () => {
  dialogVisible.value = true
  dialogVisibleSelect.value = false
}

const handleCancelVerify = () => {
  dialogVisible.value = true
  dialogVisibleVerify.value = false
}

const selectRef = ref()
const selectForm = ref({
  o04: ''
})
const handleSelectbtn = () => {
  // 校验
  selectRef.value.validate((isOk) => {
    if (isOk) {
      tableData[currentID].o04 = selectForm.value.o04
      dialogVisibleSelect.value = false
      dialogVisible.value = true
    }
  })
}

const verifyruleFormRef = ref()
const handleVerifyBtn = () => {
  // 校验
  verifyruleFormRef.value.validate((isOk) => {
    if (isOk) {
      dialogVisibleVerify.value = false
      dialogVisible.value = true
    }
  })
}

// 添加板块
const addVisible = ref(false)
const handleAddbtn = () => {
  addVisible.value = true
}

const addFormRef = ref()
const addForm = ref({
  o01: '',
  o04: '',
  o10: '',
  standar: '',
  o12: '',
  o13: '',
  result: '',
  text: ''
})
const addRules = {
  o04: [{ required: true, message: '请输入完工单号', trigger: 'blur' }],
  o10: [{ required: true, message: '请输入检验标准', trigger: 'blur' }],
  o12: [{ required: true, message: '请输入抽取数量', trigger: 'blur' }],
  o13: [{ required: true, message: '请输入校验值', trigger: 'blur' }],
  result: [{ required: true, message: '请输入检验结果', trigger: 'blur' }]
}

// 点击添加确认按钮
const addBtn = () => {
  addFormRef.value.validate((isOk) => {
    if (isOk) {
      // 调用接口
      // 把输入的数据添加给tableData
      tableData.value.push({
        o01: tableData.value.length + 1,
        o02: '20210810001',
        o03: '001',
        o04: addForm.value.o04,
        o05: '作业名称',
        o06: '生产线名称',
        o07: '检验批次',
        o08: '产品名称',
        o09: '2024-08-10',
        o10: addForm.value.o10,
        o11: '100',
        o12: addForm.value.o12,
        o13: addForm.value.o13,
        o14: '阀值上限',
        o15: '阀值下限',
        o16: addForm.value.result,
        o17: '检验人',
        o18: '2023-08-10'
      })
      // 将数据添加到本地
      localStorage.setItem('tableDatas', JSON.stringify(tableData.value))
      // 提示消息
      console.log(addForm.value)
      ElMessage.success('添加成功')
      // 关闭弹框+重置表单
      addCancelbtn()
    }
  })
}

const addCancelbtn = () => {
  // 重置表单
  addFormRef.value.resetFields()
  addForm.value = {
    o10: '',
    o01: '',
    o04: '',
    standar: '',
    o12: '',
    o13: '',
    result: '',
    text: ''
  }
  // 关闭弹框
  addVisible.value = false
}

const dialoghandleAddSelect = ref(false)
const handleAddSelects = () => {
  if (addVisible.value) {
    addVisible.value = false
    dialoghandleAddSelect.value = true
  }
}

// 储存完工单号数据
const finallyOne = ref({
  o04: '',
  o10: addForm.value.o10
})

// 选择
const handleSelectbtns = () => {
  // 校验
  selectRef.value.validate((isOk) => {
    if (isOk) {
      // console.log(finallyOne.value.o04)
      // 返回数据给addForm
      addForm.value.o04 = finallyOne.value.o04
      finallyOne2.value.o04 = finallyOne.value.o04
      addForm.value.o10 = finallyOne.value.o10
      dialoghandleAddSelect.value = false
      addVisible.value = true
      console.log(addForm.value)
    }
  })
}
// 取消
const handleSelectCancels = () => {
  // 重置表单
  selectRef.value.resetFields()
  finallyOne.value = {
    o04: ''
  }
  // 关闭弹框
  addVisible.value = true
  dialoghandleAddSelect.value = false
}

const selectRef2 = ref()
const dialoghandleAddSelect2 = ref(false)
const handleAddSelects2 = () => {
  if (addVisible.value) {
    addVisible.value = false
    dialoghandleAddSelect2.value = true
  }
}

// 储存完工单号数据
const finallyOne2 = ref({
  o10: '',
  o04: addForm.value.o04
})

// 校验标准选择
const handleSelectbtns2 = () => {
  // 校验
  selectRef2.value.validate((isOk) => {
    if (isOk) {
      // console.log(finallyOne.value.o04)
      // 返回数据给addForm
      addForm.value.o10 = finallyOne2.value.o10
      finallyOne.value.o10 = addForm.value.o10
      addForm.value.o04 = finallyOne2.value.o04
      dialoghandleAddSelect2.value = false
      addVisible.value = true
      console.log(addForm.value)
    }
  })
}
// 校验标准取消
const handleSelectCancels2 = () => {
  // 重置表单
  selectRef2.value.resetFields()
  finallyOne2.value = {
    o10: ''
  }
  // 关闭弹框
  addVisible.value = true
  dialoghandleAddSelect2.value = false
}

// 搜索功能板块
const searchValue = ref({
  o02: '', //流水号
  o04: '', //完工单号
  o03: '', //计划编号
  o05: '', //作业名称
  o08: '', //产品名称
  o07: '', //检验批次
  o09: '', //生产日期
  o10: '', //检验项
  o16: '', //检验结果
  o17: '', //检验人
  o18: '' //检验时间
})

// 进行相关搜索
const searchData = () => {
  const filteredData = tableData.value.filter((item) => {
    const searchValues = searchValue.value

    // Check each condition only if the search value is provided
    const o02 = !searchValues.o02 || item.o02.includes(searchValues.o02)
    const o04 = !searchValues.o04 || item.o04.includes(searchValues.o04)
    const o03 = !searchValues.o03 || item.o03.includes(searchValues.o03)
    const o05 = !searchValues.o05 || item.o05.includes(searchValues.o05)
    const o08 = !searchValues.o08 || item.o08.includes(searchValues.o08)
    const o07 = !searchValues.o07 || item.o07.includes(searchValues.o07)
    // const o09 = !searchValues.o09 || item.o09.includes(searchValues.o09)

    // 转化日期格式
    let o09 = true
    // 把时间戳转化为日期格式
    if (o09) {
      const [start, end] = searchValues.o09
      const starts = new Date(start)
      const startsYear = starts.getFullYear()
      const startsMonth = starts.getMonth() + 1
      const startsDay = starts.getDate()
      const ends = new Date(end)
      const endsYear = ends.getFullYear()
      const endsMonth = ends.getMonth() + 1
      const endsDay = ends.getDate()
      const newStart = `${startsYear}-${startsMonth}-${startsDay}`
      const newEnd = `${endsYear}-${endsMonth}-${endsDay}`
      if (newStart && newEnd) {
        o09 = item.o09 >= newStart && item.o09 <= newEnd
      }
      console.log(newStart, newEnd, item.o09)
    }
    const o10 = !searchValues.o10 || item.o10.includes(searchValues.o10)

    let o16 = true // Default to true if no o16 value provided
    if (searchValues.o16) {
      if (searchValues.o16 === '1') {
        o16 = item.o16.includes('合格')
      } else if (searchValues.o16 === '2') {
        o16 = item.o16.includes('不合格')
      }
    }

    const o17 = !searchValues.o17 || item.o17.includes(searchValues.o17)
    const o18 = !searchValues.o18 || item.o18.includes(searchValues.o18)

    // 转化日期格式
    // let o18 = true
    // if (o18) {
    //   const [kaishi, jieshu] = searchValues.o18
    //   const kaishis = new Date(kaishi)
    //   const startsYeas = kaishis.getFullYear()
    //   const startsMonths = kaishis.getMonth() + 1
    //   const startsDays = kaishis.getDate()
    //   const endss = new Date(jieshu)
    //   const endsYears = endss.getFullYear()
    //   const endsMonths = endss.getMonth() + 1
    //   const endsDays = endss.getDate()
    //   const newStarts = `${startsYeas}-${startsMonths}-${startsDays}`
    //   const newEnds = `${endsYears}-${endsMonths}-${endsDays}`
    //   if (newStarts && newEnds) {
    //     o18 = item.o18 >= newStarts && item.o18 <= newEnds
    //   }
    // }
    // 把时间戳转化为日期格式

    // Combine all conditions using && to filter the data
    return (
      o02 && o04 && o03 && o05 && o08 && o07 && o09 && o10 && o16 && o17 && o18
    )
  })

  tableData.value = filteredData
}

// 重置搜索
// 绑定原始数组响应式
const tableDataall = ref([...tableData.value])
const resetSearch = () => {
  searchValue.value = {
    o02: '', //流水号
    o04: '', //完工单号
    o03: '', //计划编号
    o05: '', //作业名称
    o08: '', //产品名称
    o07: '', //检验批次
    o09: '', //生产日期
    o10: '', //检验项
    o16: '', //检验结果
    o17: '', //检验人
    o18: '' //检验时间
  }
  tableData.value = [...tableDataall.value]
}

// 日期选择
</script>

<template>
  <div>
    <!-- 添加 -->
    <el-button type="primary" style="margin-bottom: 20px" @click="handleAddbtn"
      >添加</el-button
    >
    <!-- 点击添加弹出的对话框 -->
    <el-dialog
      v-model="addVisible"
      title="添加生产采样单"
      width="500"
      @close="addCancelbtn"
    >
      <el-form
        ref="addFormRef"
        style="max-width: 600px"
        :model="addForm"
        status-icon
        :rules="addRules"
        label-width="auto"
        class="demo-ruleForm"
      >
        <el-form-item label="完工单号" prop="o04">
          <!-- 选择按钮 -->
          <el-input
            disabled
            v-model="addForm.o04"
            placeholder="请选择"
            style="width: 80%; margin-right: 10px"
          ></el-input>
          <el-button type="primary" @click="handleAddSelects">选择</el-button>
          <!-- 弹框 -->
        </el-form-item>
        <el-form-item label="校验标准" prop="o10">
          <!-- 选择按钮 -->
          <el-input
            disabled
            v-model="addForm.o10"
            placeholder="请选择"
            style="width: 80%; margin-right: 10px"
          ></el-input>
          <el-button type="primary" @click="handleAddSelects2">选择</el-button>
          <!-- 弹框 -->
        </el-form-item>
        <el-form-item label="抽取数量" prop="o12">
          <el-input v-model="addForm.o12" placeholder="请输入抽取数量" />
        </el-form-item>
        <el-form-item label="校验值" prop="o13">
          <el-input v-model="addForm.o13" placeholder="请输入校验值" />
        </el-form-item>
        <el-form-item label="校验结果" prop="result">
          <el-input v-model="addForm.result" placeholder="请输入校验结果" />
        </el-form-item>
        <el-form-item label="备注" prop="text">
          <el-input
            v-model="addForm.text"
            type="textarea"
            placeholder="在这里输入备注"
          />
        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="addBtn"> 确认 </el-button>
          <el-button @click="addCancelbtn">取消</el-button>
        </div>
      </template>
    </el-dialog>

    <!-- 点击搜索按钮-完工单号 -->
    <el-dialog
      v-model="dialoghandleAddSelect"
      title="选择生产完工单"
      width="500"
      @close="handleSelectCancels"
    >
      <el-form
        ref="selectRef"
        style="max-width: 600px"
        :model="finallyOne"
        status-icon
        :rules="rules"
        label-width="auto"
        class="demo-ruleForm"
      >
        <el-form-item label="完工单号" prop="o04">
          <!-- 选择按钮 -->
          <el-input
            type="text"
            v-model="finallyOne.o04"
            placeholder="请输入完工单号-格式00xx"
          ></el-input>
        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="handleSelectbtns"> 选择 </el-button>
          <el-button @click="handleSelectCancels">取消</el-button>
        </div>
      </template>
    </el-dialog>
    <!-- 点击搜索按钮-校验标准 -->
    <el-dialog
      v-model="dialoghandleAddSelect2"
      title="选择校验标准"
      width="500"
      @close="handleSelectCancels2"
    >
      <el-form
        ref="selectRef2"
        style="max-width: 600px"
        :model="finallyOne2"
        status-icon
        :rules="rules"
        label-width="auto"
        class="demo-ruleForm"
      >
        <el-form-item label="校验标准" prop="o10">
          <!-- 选择按钮 -->
          <el-input
            type="text"
            v-model="finallyOne2.o10"
            placeholder="请输入校验标准-格式xxx"
          ></el-input>
        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="handleSelectbtns2">
            选择
          </el-button>
          <el-button @click="handleSelectCancels2">取消</el-button>
        </div>
      </template>
    </el-dialog>
    <!-- 搜索框 -->
    <el-row type="flex" justify="start">
      <el-col :span="2">
        <el-input v-model="searchValue.o02" placeholder="请输入流水号" />
      </el-col>
      <el-col :span="2">
        <el-input v-model="searchValue.o04" placeholder="请输入完工单号" />
      </el-col>
      <el-col :span="2">
        <el-input v-model="searchValue.o03" placeholder="请输入计划编号" />
      </el-col>
      <el-col :span="2">
        <el-input v-model="searchValue.o05" placeholder="请输入作业名称" />
      </el-col>
      <el-col :span="2">
        <el-input v-model="searchValue.o08" placeholder="请输入产品名称" />
      </el-col>
      <el-col :span="2">
        <el-input v-model="searchValue.o07" placeholder="请输入检验批次" />
      </el-col>
      <el-col :span="3">
        <el-date-picker
          v-model="searchValue.o09"
          type="daterange"
          range-separator="至"
          start-placeholder="开始生产日期"
          end-placeholder="结束生产日期"
          style="width: 100%"
        />
      </el-col>
      <el-col :span="2">
        <el-input v-model="searchValue.o10" placeholder="请输入检验项" />
      </el-col>
      <el-col :span="2">
        <el-select v-model="searchValue.o16" placeholder="请选择检验结果">
          <el-option label="合格" value="1"></el-option>
          <el-option label="不合格" value="2"></el-option>
        </el-select>
      </el-col>
      <el-col :span="2">
        <el-input v-model="searchValue.o17" placeholder="请输入检验人" />
      </el-col>
      <el-col :span="3">
        <el-date-picker
          v-model="searchValue.o18"
          type="daterange"
          range-separator="至"
          start-placeholder="开始检验时间"
          end-placeholder="结束检验时间"
          style="width: 100%"
        />
      </el-col>
    </el-row>
    <el-row
      type="flex"
      justify="center"
      style="margin-top: 20px; margin-bottom: 10px"
    >
      <el-col :span="6">
        <el-button @click="searchData" type="primary" size="large"
          >搜索</el-button
        >
        <el-button @click="resetSearch" type="info" size="large"
          >重置</el-button
        >
      </el-col>
    </el-row>

    <!-- 检验结果合格和不合格 -->

    <el-table stripe :data="tableData" style="width: 100%">
      <el-table-column prop="o01" label="编号"> </el-table-column>
      <el-table-column prop="o02" label="流水号"> </el-table-column>
      <el-table-column prop="o03" label="计划编号"> </el-table-column>

      <el-table-column prop="o04" label="完工单号"> </el-table-column>
      <el-table-column prop="o05" label="作业名称"> </el-table-column>
      <el-table-column prop="o06" label="生产线名称"> </el-table-column>
      <el-table-column prop="o07" label="检验批次"> </el-table-column>
      <el-table-column prop="o08" label="产品名称"> </el-table-column>
      <el-table-column prop="o09" label="生产日期"> </el-table-column>
      <el-table-column prop="o10" label="检验项"> </el-table-column>
      <el-table-column prop="o11" label="生产数量"> </el-table-column>
      <el-table-column prop="o12" label="抽检数量"> </el-table-column>
      <el-table-column prop="o13" label="检验值"> </el-table-column>
      <el-table-column prop="o14" label="阀值上限"> </el-table-column>

      <el-table-column prop="o15" label="阀值下限"> </el-table-column>

      <el-table-column prop="o16" label="检验结果"> </el-table-column>
      <el-table-column prop="o17" label="检验人"> </el-table-column>
      <el-table-column prop="o18" label="检验时间"> </el-table-column>

      <el-table-column label="操作">
        <template #default="{ row }">
          <el-button type="primary" @click="changeDate(row)">修改</el-button>
          <el-popconfirm
            title="你确定要删除这条数据吗?"
            @confirm="clickRemove(row)"
            confirm-button-text="确定"
            cancel-button-text="取消"
            confirm-type="warining"
            concel-button-type="info"
          >
            <template #reference>
              <el-button type="danger">删除</el-button>
            </template>
          </el-popconfirm>
        </template>
      </el-table-column>
    </el-table>
  </div>

  <!-- 点击修改按钮弹出的对话款 -->
  <el-dialog
    v-model="dialogVisible"
    title="修改产品校验单"
    width="500"
    @close="handleCancel"
  >
    <el-form
      ref="ruleFormRef"
      style="max-width: 600px"
      :model="ruleForm"
      status-icon
      :rules="rules"
      label-width="auto"
      class="demo-ruleForm"
    >
      <el-form-item label="完工单号" prop="o04">
        <!-- 选择按钮 -->
        <el-select
          @click="handleSelect(item)"
          v-model="ruleForm.o04"
          placeholder="请选择"
          size="large"
          style="width: 240px"
        >
          <el-option
            v-for="item in D"
            :key="item.o01"
            :label="item.o04"
            :value="item.o01"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="校验标准" prop="o10">
        <el-select
          @click="handleVerify"
          v-model="ruleForm.o10"
          placeholder="请选择"
          size="large"
          style="width: 240px"
        >
          <el-option
            v-for="item in tableData"
            :key="item.o01"
            :label="item.o10"
            :value="item.o01"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="抽取数量" prop="o12">
        <el-input v-model="ruleForm.o12" placeholder="请输入抽取数量" />
      </el-form-item>
      <el-form-item label="校验值" prop="o13">
        <el-input v-model="ruleForm.o13" placeholder="请输入校验值" />
      </el-form-item>
      <el-form-item label="校验结果" prop="result">
        <el-input v-model="ruleForm.result" placeholder="请输入校验结果" />
      </el-form-item>
      <el-form-item label="备注" prop="text">
        <el-input
          v-model="ruleForm.text"
          type="textarea"
          placeholder="在这里输入备注"
        />
      </el-form-item>
    </el-form>
    <template #footer="{ row }">
      <div class="dialog-footer">
        <el-button type="primary" @click="handleRequired(row)">
          确认
        </el-button>
        <el-button @click="handleCancel">取消</el-button>
      </div>
    </template>
  </el-dialog>

  <!-- 点击选择按钮弹出对话框 -->
  <el-dialog
    v-model="dialogVisibleSelect"
    title="选择生产完工单"
    width="500"
    @close="handleSelectCancel"
  >
    <el-form
      ref="selectRef"
      style="max-width: 600px"
      :model="ruleForm"
      status-icon
      :rules="rules"
      label-width="auto"
      class="demo-ruleForm"
    >
      <el-form-item label="完工单号" prop="o04">
        <!-- 选择按钮 -->
        <el-select
          v-model="ruleForm.o04"
          placeholder="请选择"
          size="large"
          style="width: 240px"
        >
          <el-option
            v-for="item in tableData"
            :key="item.o01"
            :label="item.o04"
            :value="item.o04"
          />
        </el-select>
      </el-form-item>
    </el-form>
    <template #footer>
      <div class="dialog-footer">
        <el-button type="primary" @click="handleSelectbtn"> 选择 </el-button>
        <el-button @click="handleSelectCancel">取消</el-button>
      </div>
    </template>
  </el-dialog>

  <!-- 选择校验标准弹框 -->
  <el-dialog
    v-model="dialogVisibleVerify"
    title="选择校验标准"
    width="500"
    @close="handleCancelVerify"
  >
    <el-form
      ref="verifyruleFormRef"
      style="max-width: 600px"
      :model="ruleForm"
      status-icon
      :rules="rules"
      label-width="auto"
      class="demo-ruleForm"
    >
      <el-form-item label="校验标准" prop="o10">
        <el-select
          @click="handleVerify"
          v-model="ruleForm.o10"
          placeholder="请选择"
          size="large"
          style="width: 240px"
        >
          <el-option
            v-for="item in tableData"
            :key="item.o01"
            :label="item.o10"
            :value="item.o10"
          />
        </el-select>
      </el-form-item>
    </el-form>
    <template #footer>
      <div class="dialog-footer">
        <el-button type="primary" @click="handleVerifyBtn"> 选择 </el-button>
        <el-button @click="handleCancelVerify">取消</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<style lang="scss" scoped>
// :deep(*) {
//   background: url(../../assets/login_bg.jpg) no-repeat;
// }
</style>
